
<%@ page import="org.trendit.Post" %>
<!doctype html>
<html>
	<head>
		<meta name="layout" content="bootstrap">
		<g:set var="entityName" value="${message(code: 'post.label', default: 'Post')}" />
		<title><g:message code="default.list.label" args="[entityName]" /></title>
		 <script src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
   
		<script type="text/javascript">
      $('document').ready(function(){
      
        var i=0
        var NewContent='<div class="added">Added</div>' 
        $(".add1").click(function(){
                i = i+1;
                $("#spin").after(NewContent+i);

        });
      });
    </script>
	</head>
	<body>
	<p>
<g:form action="addPost" id="${params.id}">
<g:textArea id='postContent' name="content" rows="3" cols="50"/><br/>
<g:submitButton name="post" value="Post"/> </g:form>
</p>
	<a class="add1" href="#">Add</a>
    <div id="spin1">#SPIN</div>
		<div class="row-fluid">
			
			<div class="span3">
				<div class="well">
					<ul class="nav nav-list">
						<li class="nav-header">${entityName}</li>
						<li class="active">
							<g:link class="list" action="list">
								<i class="icon-list icon-white"></i>
								<g:message code="default.list.label" args="[entityName]" />
							</g:link>
						</li>
						<li>
							<g:link class="create" action="create">
								<i class="icon-plus"></i>
								<g:message code="default.create.label" args="[entityName]" />
							</g:link>
						</li>
					</ul>
				</div>
			</div>

			<div class="span9">
				
				<div class="page-header">
					<h1><g:message code="default.list.label" args="[entityName]" /></h1>
				</div>

				<g:if test="${flash.message}">
				<bootstrap:alert class="alert-info">${flash.message}</bootstrap:alert>
				</g:if>
				

    
				<table class="table table-striped">
					<thead id='spin'>
						<tr>
						
							<g:sortableColumn property="content" title="${message(code: 'post.content.label', default: 'Content')}" />
						
							<g:sortableColumn property="dateCreated" title="${message(code: 'post.dateCreated.label', default: 'Date Created')}" />
						
							<th class="header"><g:message code="post.user.label" default="User" /></th>
						
							<th></th>
						</tr>
					</thead>
					<tbody>
					<g:each in="${postInstanceList}" var="postInstance">
						<tr>
						
							<td>${fieldValue(bean: postInstance, field: "content")}</td>
						
							<td><g:formatDate date="${postInstance.dateCreated}" /></td>
						
							<td>${fieldValue(bean: postInstance, field: "user")}</td>
						
							<td class="link">
								<g:link action="show" id="${postInstance.id}" class="btn btn-small">Show &raquo;</g:link>
							</td>
						</tr>
					</g:each>
					</tbody>
				</table>
				<div class="pagination">
					<bootstrap:paginate total="${postInstanceTotal}" />
				</div>
			</div>

		</div>
	</body>
</html>
